home *** CD-ROM | disk | FTP | other *** search
/ MacAddict 123 / MacAddict_123_2006_11.iso / Software / Utilities / VelaClock 1.9.wdgt / Scripts / InfoDivs.js < prev    next >
Text File  |  2006-08-29  |  25KB  |  796 lines
  1. // Copyright 2005-2006, Vela Design Group.  All rights reserved.
  2.  
  3. //##################################################################
  4. //
  5. //  InfoDivs
  6. //
  7. //##################################################################
  8.  
  9. var infoDivBottomHeight = 4; //1 below each info item
  10. var infoAreaTopHeight = 5;     //5 22 above entire info area
  11. var infoAreaBottomHeight = 2;//2 6 below entire info area
  12. //infoAreaTopHeight + infoAreaBottomHeight
  13.  
  14. var sunDivIdx = 0;
  15. var riseSetDivIdx = 1;
  16. var moonDivIdx = 2;
  17. var timeDivIdx = 3;
  18.  
  19. //IMPORTANT:
  20. //    1) Literals for sunDivIdx, moonDivIdx and timeDivIdx are used in VelaClock.html
  21. //        for clickOnInfoItemTitle() and clickOnInfoItemButton().
  22. //    2) The order of these divs needs to be the same as in VelaClock.html. This
  23. //        is so hideLastDividerBar() can hide the last divider bar.
  24.  
  25. var infoDivs = [
  26.     
  27.     {id:'sunDiv', parentID:'sunDivContainer',
  28.         showing:true, fullHeight:true, inMenu:false,
  29.         arrowID: 'sunDivArrow', buttonID: 'divSunButton',
  30.         minHeight:20, maxHeight:94}, //74
  31.     
  32.     {id:'riseSetDiv', parentID:'riseSetDivContainer',
  33.         showing:true, fullHeight:false, inMenu:true,
  34.         arrowID: 'riseSetDivArrow', buttonID: 'divRiseSetButton',
  35.         minHeight:34, maxHeight:127}, //prev: minHeight:36; maxHeight:124
  36.     
  37.     {id:'moonDiv', parentID:'moonDivContainer',
  38.         showing:true, fullHeight:false, inMenu:false,
  39.         arrowID: 'moonDivArrow', buttonID: 'divMoonButton',
  40.         minHeight:21, maxHeight:99},
  41.     
  42.     {id:'timeDiv', parentID:'timeDivContainer',
  43.         showing:true, fullHeight:true, inMenu:false,
  44.         arrowID: 'timeDivArrow', buttonID: 'divTimeButton',
  45.         minHeight:19, maxHeight:112}, //114 vc161:maxHeight:107
  46. ];
  47.  
  48. function updateDisplayOptions()
  49. {
  50.     //tell plug-in which panes about showing/fullHeight attributes.
  51.     vtMain2.setWidgetDisplayOptions(infoDivs, infoDivs.length);
  52. }
  53.  
  54. function setupInfoDivs()
  55. {
  56.     //alert("###");
  57.     //alert("setupInfoDivs");
  58.     
  59.     vtMain2.getWidgetDisplayOptions(infoDivs, infoDivs.length);
  60.  
  61.     //Don't show last divider bar
  62.     hideLastDividerBar();
  63.  
  64.     var infoHeight = 0;
  65.  
  66.     var index;
  67.     var count = infoDivs.length;
  68.     for (index = 0; index < count; ++index)
  69.     {
  70.         var infoDivItem = infoDivs[index];
  71.         var divElement = document.getElementById(infoDivItem.id);
  72.         
  73.         var v = infoDivItem.fullHeight ? infoDivItem.maxHeight : infoDivItem.minHeight;
  74.         divElement.setAttribute("style", "height:" + v + "px;");
  75.         
  76.         if (infoDivItem.showing)
  77.             infoHeight += v + infoDivBottomHeight;
  78.         
  79.         //set initial div button.
  80.         if (infoDivItem.arrowID.length > 0) {
  81.             if (infoDivItem.fullHeight)
  82.                 document.getElementById(infoDivItem.arrowID).src = "Images/arrowDown.png";
  83.             else
  84.                 document.getElementById(infoDivItem.arrowID).src = "Images/arrowRight.png";
  85.         }
  86.         
  87.         //set on/off states for sun, rise/set, moon and time buttons.
  88.         if (infoDivItem.buttonID.length > 0) {
  89.             var buttonElem = document.getElementById(infoDivItem.buttonID);
  90.             if (infoDivItem.showing)
  91.                 buttonElem.src = "Images/" + infoDivItem.buttonID + "_on.png";
  92.             else
  93.                 buttonElem.src = "Images/" + infoDivItem.buttonID + "_off.png";
  94.         }
  95.         
  96.         //show or hide parent div.
  97.         var subInfoDivParentElem = document.getElementById(infoDivItem.parentID);
  98.         if (infoDivItem.showing)
  99.             subInfoDivParentElem.setAttribute ('style', 'display:block;');
  100.         else
  101.             subInfoDivParentElem.setAttribute ('style', 'display:none;');
  102.         
  103.         if (moonDivIdx == index) {
  104.             if (infoDivItem.fullHeight)
  105.                 document.getElementById('curPhaseDot').setAttribute ("style", "visibility:hidden;");
  106.             else
  107.                 document.getElementById('curPhaseDot').setAttribute ("style", "visibility:visible;");
  108.         } else if (timeDivIdx == index) {
  109.             if (infoDivItem.fullHeight) {
  110.                 document.getElementById('utc_tzAbbr').setAttribute ("style", "visibility:hidden;");
  111.                 document.getElementById('localTimeDiv').setAttribute ("style", "visibility:visible;");
  112.             } else {
  113.                 document.getElementById('utc_tzAbbr').setAttribute ("style", "visibility:visible;");
  114.                 document.getElementById('localTimeDiv').setAttribute ("style", "visibility:hidden;");
  115.             }
  116.         }
  117.  
  118.         
  119.         /*
  120.         if (timeDivIdx == index) {
  121.             if (infoDivItem.fullHeight)
  122.                 document.getElementById('clockFace').setAttribute ("style", "display:inline-block;");
  123.             else
  124.                 document.getElementById('clockFace').setAttribute ("style", "display:none;");
  125.         }
  126.         */
  127.         
  128.         //alert(index + " setup infoDivItem.id = " + infoDivItem.id);
  129.         //alert("    v = " + v);
  130.         //alert("    divElement.style.height = " + divElement.style.height);
  131.         //alert("    parseInt(divElement.style.height, 10) = " + parseInt(divElement.style.height, 10));
  132.  
  133.     }
  134.     
  135.     //set height of 'infoAreaContainer'
  136.     //alert("setupInfoDivs: infoHeight = " + infoHeight);
  137.     infoHeight += infoAreaTopHeight + infoAreaBottomHeight;
  138.     document.getElementById('infoAreaContainer').setAttribute("style", "height:" + infoHeight + "px;");
  139. }
  140.  
  141. var myInfoDivItem;
  142.  
  143. function displayParent()
  144. {
  145.     var subInfoDivParentElem = document.getElementById(myInfoDivItem.parentID);
  146.     
  147.     if (myInfoDivItem.showing)
  148.         subInfoDivParentElem.setAttribute ('style', 'display:block;');
  149.     else
  150.         subInfoDivParentElem.setAttribute ('style', 'display:none;');
  151.     //alert("displayParent:" + showIt);
  152. }
  153.  
  154. function showHideInfoDiv (infoItemIdx)
  155. {
  156.     myInfoDivItem = infoDivs[infoItemIdx];
  157.     //IMPORTANT: myInfoDivItem is used in displayParent()
  158.     
  159.     var subInfoDivParentElem = document.getElementById(myInfoDivItem.parentID);
  160.     var buttonElem = document.getElementById(myInfoDivItem.buttonID);
  161.     
  162.     if (myInfoDivItem.showing) {
  163.         buttonElem.src = "Images/" + myInfoDivItem.buttonID + "_off.png";
  164.         setupInfoItemAnimation (true, true, infoItemIdx);
  165.         myInfoDivItem.showing = false;
  166.     } else {
  167.         //added for vc 181
  168.         if (window.vtMain && timeDivIdx == infoItemIdx)
  169.             setTimeout ('vtMain.refreshClockFace();', 0);
  170.  
  171.         buttonElem.src = "Images/" + myInfoDivItem.buttonID + "_on.png";
  172.         myInfoDivItem.showing = true;
  173.         setupInfoItemAnimation (false, true, infoItemIdx);
  174.     }
  175.  
  176.     updateDisplayOptions();
  177.     updateInfo();
  178.  
  179. }
  180.  
  181. //clickOnInfoItemButton is called when the sun, moon or time button is clicked.
  182. function clickOnInfoItemButton(infoItemIdx)
  183. {
  184.     showHideInfoDiv(infoItemIdx); //show or hide div
  185.  
  186.     //IMPORTANT: myInfoDivItem is set in showHideInfoDiv
  187.     /*
  188.     if (myInfoDivItem.buttonID.length > 0) {
  189.         if (myInfoDivItem.showing)
  190.             document.getElementById(myInfoDivItem.buttonID).setAttribute ("style", "opacity:1.0;");
  191.         else
  192.             document.getElementById(myInfoDivItem.buttonID).setAttribute ("style", "opacity:0.5;");
  193.     }
  194.     */
  195. }
  196.  
  197.  
  198. function clickOnInfoItemTitle(event, infoItemIdx)
  199. {
  200.     var subInfoDiv = infoDivs[infoItemIdx];
  201.  
  202.     if (subInfoDiv.fullHeight) {
  203.         //hide info item area
  204.         setupInfoItemAnimation (true, false, infoItemIdx);
  205.         subInfoDiv.fullHeight = false;
  206.         
  207.         if (moonDivIdx == infoItemIdx) {
  208.             document.getElementById('curPhaseDot').setAttribute ("style", "visibility:visible;");
  209.         } else if (timeDivIdx == infoItemIdx) {
  210.             document.getElementById('utc_tzAbbr').setAttribute ("style", "visibility:visible;");
  211.             document.getElementById('localTimeDiv').setAttribute ("style", "visibility:hidden;");
  212.         }
  213.         
  214.         if (subInfoDiv.arrowID.length > 0)
  215.             document.getElementById(subInfoDiv.arrowID).src = "Images/arrowRight.png";
  216.     } else {
  217.         //show info item area
  218.         subInfoDiv.fullHeight = true;
  219.         //added for vc 181
  220.         if (window.vtMain && timeDivIdx == infoItemIdx)
  221.             setTimeout ('vtMain.refreshClockFace();', 0);
  222.         setupInfoItemAnimation (false, false, infoItemIdx);
  223.  
  224.         if (moonDivIdx == infoItemIdx) {
  225.             document.getElementById('curPhaseDot').setAttribute ("style", "visibility:hidden;");
  226.         } else if (timeDivIdx == infoItemIdx) {
  227.             document.getElementById('utc_tzAbbr').setAttribute ("style", "visibility:hidden;");
  228.             document.getElementById('localTimeDiv').setAttribute ("style", "visibility:visible;");
  229.         }
  230.  
  231.         if (subInfoDiv.arrowID.length > 0)
  232.             document.getElementById(subInfoDiv.arrowID).src = "Images/arrowDown.png";
  233.     }
  234.     
  235.     updateDisplayOptions();
  236.     updateInfo();
  237.     //switchToSunDiv(event);
  238.     //updateInfo();
  239. }
  240.  
  241. function setupInfoAnimation (hidingDiv)
  242. {
  243.     var infoDiv = document.getElementById('infoAreaContainer');
  244.     var timeNow = (new Date).getTime();
  245.     var multiplier = (event.shiftKey ? 10 : 1); // enable slo-mo
  246.         
  247.     opacityAnimation.changeOpacity = false;
  248.  
  249.     var currentInfoHeight = 0;
  250.     var index;
  251.     var count = infoDivs.length;
  252.     for (index = 0; index < count; ++index)
  253.     {        
  254.         var infoDivItem = infoDivs[index];
  255.         if (infoDivItem.showing) {
  256.             //if (infoDivItem.fullHeight)
  257.             var divElement = document.getElementById(infoDivItem.id); //such as "sunDiv"
  258.  
  259.             //alert(index + " anim infoDivItem.id = " + infoDivItem.id);
  260.             //alert("    divElement.style.height = " + divElement.style.height);
  261.             //alert("    parseInt(divElement.style.height, 10) = " + parseInt(divElement.style.height, 10));
  262.  
  263.             currentInfoHeight += (parseInt(divElement.style.height, 10) + infoDivBottomHeight);
  264.             //alert("    currentInfoHeight = " + currentInfoHeight);
  265.         }
  266.     }
  267.     
  268.     currentInfoHeight += infoAreaTopHeight + infoAreaBottomHeight;
  269.  
  270.     var startingSize = parseInt(infoDiv.clientHeight,10);
  271.     //alert("infoArea: startingSize = " + startingSize);
  272.         
  273.     if (hidingDiv) {
  274.         //hide the tabs
  275.         document.getElementById('divSunButton').setAttribute ("style", "display:none;");
  276.         document.getElementById('divRiseSetButton').setAttribute ("style", "display:none;");        
  277.         document.getElementById('divTimeButton').setAttribute ("style", "display:none;");
  278.         document.getElementById('divMoonButton').setAttribute ("style", "display:none;");
  279.     
  280.         document.getElementById('footer').setAttribute ("style", "background-image:url(Images/borderBottomNoTabs.png);");
  281.         //document.getElementById('infoKindMenu').setAttribute ("style", "display:none;");
  282.  
  283.         //infoDiv.style.overflow = "hidden";
  284.         //alert("setupInfoAnimation - entering: hidingDiv");
  285.     }
  286.     else {
  287.         document.getElementById('footer').setAttribute ("style", "background-image:url(Images/borderBottom.png);");
  288.         //document.getElementById('infoKindMenu').setAttribute ("style", "display:inline-block;");
  289.     }
  290.  
  291.     resizeInfoDiv.element = infoDiv;
  292.     if (resizeAnimation.timer != null) // it is moving... change to new size
  293.     {
  294.         clearInterval(resizeAnimation.timer);
  295.         resizeAnimation.timer = null;
  296.         resizeAnimation.duration -= (timeNow - resizeAnimation.startTime);
  297.         resizeInfoDiv.positionFrom = resizeInfoDiv.positionNow;
  298.     }
  299.     else
  300.     {
  301.         resizeAnimation.duration = 250 * multiplier;
  302.         resizeInfoDiv.positionFrom = startingSize;
  303.     }
  304.     
  305.     if (!hidingDiv)
  306.     {
  307.         //increase widget height before showing info DIV
  308.         calcWidgetHeightAndResize();
  309.     }
  310.     
  311.     resizeInfoDiv.positionTo = hidingDiv ? 0 : currentInfoHeight;
  312.     resizeAnimation.startTime = timeNow - 13; // set it back one frame.
  313.     resizeAnimation.onfinished = hidingDiv ? animHidingFinished : animShowingFinished;
  314.     
  315.     //alert("#parent hidingDiv = " + hidingDiv);
  316.     //alert("positionFrom = " + resizeInfoDiv.positionFrom);
  317.     //alert("positionTo   = " + resizeInfoDiv.positionTo);
  318.  
  319.     resizeInfoDiv.element.style.height = startingSize;
  320.     resizeAnimation.timer = setInterval ("animate(true);", 13);
  321.     animate(true); //false
  322.     
  323.     /*
  324.     if (hidingDiv)
  325.         alert("setupInfoAnimation - leaving: hiding");
  326.     else
  327.         alert("setupInfoAnimation - leaving: showing");
  328.     */
  329. }
  330.  
  331.  
  332. //
  333. // setupInfoItemAnimation:
  334. // reducingHeight:     true when reducing height of DIV; false when increasing height.
  335. // hidingOrShowingDiv: true when the entire DIV is being hidden or shown
  336. // infoItemIdx:        index into global infoDivs array.
  337. //
  338. function setupInfoItemAnimation (reducingHeight, hidingOrShowingDiv, infoItemIdx)
  339. {
  340.     var subInfoDiv = infoDivs[infoItemIdx];
  341.     
  342.     opacityAnimation.changeOpacity = hidingOrShowingDiv;
  343.  
  344.     var subInfoDivElem;
  345.     if (hidingOrShowingDiv) {
  346.         subInfoDivElem = document.getElementById(subInfoDiv.parentID);
  347.         if (reducingHeight) {
  348.             var v = (subInfoDiv.fullHeight ? subInfoDiv.maxHeight : subInfoDiv.minHeight) + infoDivBottomHeight;
  349.             subInfoDivElem.setAttribute ("style", "height:" + v + "px;");
  350.         } else {
  351.             subInfoDivElem.setAttribute ("style", "height:0;");
  352.         }
  353.         //alert("subInfoDivElem.style.height = " + subInfoDivElem.style.height);
  354.  
  355.     } else {
  356.         document.getElementById(subInfoDiv.parentID).setAttribute ("style", "height:auto;");
  357.         subInfoDivElem = document.getElementById(subInfoDiv.id);
  358.     }
  359.     
  360.     //var subInfoDivElem = document.getElementById(subInfoDiv.id);
  361.     var infoDiv = document.getElementById('infoAreaContainer');
  362.     
  363.     var timeNow = (new Date).getTime();
  364.     var multiplier = 1;
  365.     
  366.     multiplier = (shiftWasDown ? 10 : 1); // enable slo-mo
  367.     //var multiplier = (event.shiftKey ? 10 : 1); // enable slo-mo
  368.     //if (hidingOrShowingDiv)
  369.     //    multiplier = 7;
  370.     
  371.     //var currentInfoHeight = subInfoDiv.maxHeight;
  372.  
  373.     var currentParentDivHeight = 0;
  374.     
  375.     var index;
  376.     var count = infoDivs.length;
  377.     for (index = 0; index < count; ++index)
  378.     {        
  379.         var infoDivItem = infoDivs[index];
  380.         //if (infoDivItem.showing)
  381.         //if (infoDivItem.fullHeight)
  382.         
  383.         var divElement = document.getElementById(infoDivItem.id);
  384.         
  385.         if (infoItemIdx == index) {
  386.             
  387.             if (hidingOrShowingDiv) {
  388.                 var h = (subInfoDiv.fullHeight ? subInfoDiv.maxHeight : subInfoDiv.minHeight) + infoDivBottomHeight;
  389.                 currentParentDivHeight += reducingHeight ? 0 : h;
  390.             } else {
  391.                 if (subInfoDiv.showing)
  392.                     currentParentDivHeight += (reducingHeight ? subInfoDiv.minHeight : subInfoDiv.maxHeight) + infoDivBottomHeight;
  393.             }
  394.         } else {
  395.             if (infoDivItem.showing)
  396.                 currentParentDivHeight += parseInt(divElement.style.height, 10) + infoDivBottomHeight;
  397.         }
  398.     }
  399.     currentParentDivHeight += infoAreaTopHeight + infoAreaBottomHeight;
  400.     //alert("parent: DivHeight = " + currentParentDivHeight);
  401.  
  402.     var startingSizeParentDiv = parseInt(infoDiv.clientHeight,10);
  403.     //alert("parent: startingSize = " + startingSizeParentDiv);
  404.  
  405.     var startingSize = parseInt(subInfoDivElem.clientHeight,10);
  406.     //alert("infoItem: startingSize = " + startingSize);
  407.         
  408.     //Don't show last divider bar
  409.     if (hidingOrShowingDiv && !reducingHeight)
  410.         hideLastDividerBar();
  411.         
  412.     /*
  413.     if (hidingOrShowingDiv) {
  414.         if (reducingHeight)
  415.             document.getElementById('sunDivBottom').setAttribute ("style", "display:none;");
  416.         else
  417.             document.getElementById('sunDivBottom').setAttribute ("style", "display:inline-block;");
  418.     }
  419.     */
  420.     
  421.     /*
  422.     if (reducingHeight) {
  423.         //hide the tabs
  424.         document.getElementById('divSunButton').setAttribute ("style", "display:none;");
  425.         document.getElementById('divTimeButton').setAttribute ("style", "display:none;");
  426.         document.getElementById('divMoonButton').setAttribute ("style", "display:none;");
  427.     
  428.         document.getElementById('footer').setAttribute ("style", "background-image:url(Images/borderBottomNoTabs.png);");
  429.  
  430.         //infoDiv.style.overflow = "hidden";
  431.         //alert("setupInfoAnimation - entering: reducingHeight");
  432.     }
  433.     else {
  434.         document.getElementById('footer').setAttribute ("style", "background-image:url(Images/borderBottom.png);");
  435.     }
  436.     */
  437.  
  438.     //parent div
  439.     resizeInfoDiv.element = infoDiv;
  440.     
  441.     resizeInfoItemDiv.element = subInfoDivElem;
  442.     
  443.     if (resizeAnimation.timer != null) // it is moving... change to new size
  444.     {
  445.         clearInterval(resizeAnimation.timer);
  446.         resizeAnimation.timer = null;
  447.         resizeAnimation.duration -= (timeNow - resizeAnimation.startTime);
  448.         resizeInfoItemDiv.positionFrom = resizeInfoItemDiv.positionNow;
  449.         opacityAnimation.from = opacityAnimation.now;
  450.  
  451.         //parent div
  452.         resizeInfoDiv.positionFrom = resizeInfoDiv.positionNow;
  453.     }
  454.     else
  455.     {
  456.         resizeAnimation.duration = 250 * multiplier;
  457.         resizeInfoItemDiv.positionFrom = startingSize;
  458.         
  459.         opacityAnimation.from = reducingHeight ? 1.0 : 0.70;
  460.  
  461.  
  462.         //parent div
  463.         resizeInfoDiv.positionFrom = startingSizeParentDiv;
  464.     }
  465.     
  466.     if (!reducingHeight)
  467.     {
  468.         //increase widget height before showing(or increasing height of) subInfo and info DIV
  469.         calcWidgetHeightAndResize();
  470.     }
  471.     
  472.     if (hidingOrShowingDiv) {
  473.         var h2 = (subInfoDiv.fullHeight ? subInfoDiv.maxHeight : subInfoDiv.minHeight) + infoDivBottomHeight;
  474.         resizeInfoItemDiv.positionTo = reducingHeight ? 0 : h2;
  475.         opacityAnimation.to = reducingHeight ? 0.70 : 1.0;
  476.  
  477.     } else {
  478.         resizeInfoItemDiv.positionTo = reducingHeight ? subInfoDiv.minHeight : subInfoDiv.maxHeight;
  479.     }
  480.     
  481.     resizeInfoDiv.positionTo = currentParentDivHeight;
  482.     //resizeInfoDiv.positionTo = reducingHeight ? (currentParentDivHeight - 28) : currentParentDivHeight;
  483.     
  484.     //alert("# reducingHeight = " + reducingHeight + "; hidingOrShowingDiv = " + hidingOrShowingDiv);
  485.     //alert("parent positionFrom = " + resizeInfoDiv.positionFrom);
  486.     //alert("parent positionTo   = " + resizeInfoDiv.positionTo);
  487.     
  488.     //alert("item positionFrom   = " + resizeInfoItemDiv.positionFrom);
  489.     //alert("item positionTo     = " + resizeInfoItemDiv.positionTo);
  490.  
  491.  
  492.     resizeAnimation.startTime = timeNow - 13; // set it back one frame.
  493.     if (hidingOrShowingDiv)
  494.         resizeAnimation.onfinished = reducingHeight ? infoItemContainerIsNowHidden : infoItemContainerIsNowShowing;
  495.     else
  496.         resizeAnimation.onfinished = reducingHeight ? infoItemIsNotFullHeight : infoItemIsFullHeight;
  497.     
  498.     resizeInfoItemDiv.element.style.height = startingSize;
  499.     if (opacityAnimation.changeOpacity)
  500.         resizeInfoItemDiv.element.style.opacity = opacityAnimation.from;
  501.     resizeAnimation.timer = setInterval ("animate(false);", 13);
  502.     animate(false); //true
  503. }
  504.  
  505. // hide last infoDivBottom line.
  506. function hideLastDividerBar()
  507. {
  508.     var index;
  509.     var count = infoDivs.length;
  510.     var infoDivItem;
  511.     var lastShowingDivIndex = -1;
  512.     
  513.     for (index = 0; index < count; ++index)
  514.     {        
  515.         infoDivItem = infoDivs[index];
  516.         if (infoDivItem.showing)
  517.             lastShowingDivIndex = index;
  518.     }
  519.     
  520.     //if (lastShowingDivIndex != -1)
  521.     for (index = 0; index < count; ++index)
  522.     {        
  523.         infoDivItem = infoDivs[index];            
  524.         var divElement = document.getElementById(infoDivItem.id + '_DividerBar');
  525.         
  526.         if (lastShowingDivIndex == index)
  527.             divElement.setAttribute ("style", "visibility:hidden;");
  528.         else
  529.             divElement.setAttribute ("style", "visibility:visible;");
  530.  
  531.     }
  532. }
  533.  
  534.  
  535. //var resizeAnimation = {startTime:0, duration:250, positionFrom:0, positionTo:0, positionNow:0, timer:null, element:null, onfinished:null};
  536.  
  537. var infoItemDuration = 250;
  538. var resizeAnimation = {startTime:0, duration:250, timer:null, onfinished:null};
  539. var resizeInfoDiv = {positionFrom:0, positionTo:0, positionNow:0, element:null};
  540. var resizeInfoItemDiv = {positionFrom:0, positionTo:0, positionNow:0, element:null};
  541.  
  542. var opacityAnimation = {changeOpacity:false, to:1.0, from:0.70, now:1.0};
  543.  
  544.  
  545. function limit_3 (a, b, c) {
  546.     return a < b ? b : (a > c ? c : a);
  547. }
  548.  
  549. function computeNextFloat (from, to, ease) {
  550.     return from + (to - from) * ease;
  551. }
  552.  
  553. function computeYAndResizeDiv (infoDivData, T, ease, callOnFinished) //isInfoItemDiv
  554. {
  555.     var yLoc;
  556.     var newOpacity;
  557.  
  558.     if (T >= resizeAnimation.duration)
  559.     {
  560.         yLoc = infoDivData.positionTo;
  561.         if (opacityAnimation.changeOpacity && callOnFinished)
  562.             newOpacity = opacityAnimation.to;
  563.         clearInterval (resizeAnimation.timer);
  564.         resizeAnimation.timer = null;
  565.         
  566.         if (resizeAnimation.onfinished && callOnFinished) //!isInfoItemDiv
  567.             setTimeout ("resizeAnimation.onfinished();", 0); // call after the last frame is drawn
  568.     }
  569.     else {
  570.         yLoc = computeNextFloat(infoDivData.positionFrom, infoDivData.positionTo, ease);
  571.         if (opacityAnimation.changeOpacity && callOnFinished)
  572.             newOpacity = computeNextFloat (opacityAnimation.from, opacityAnimation.to, ease);
  573.     }
  574.         
  575.     // convert to a integer, not sure if this is the best way
  576.     infoDivData.positionNow = parseInt(yLoc);
  577.     infoDivData.element.style.height = infoDivData.positionNow + "px";
  578.  
  579.     if (opacityAnimation.changeOpacity && callOnFinished) {
  580.         opacityAnimation.now = newOpacity;
  581.         infoDivData.element.style.opacity = opacityAnimation.now;
  582.     }
  583. }
  584.  
  585. function animate (isMainInfoDiv) //isInfoItemDiv
  586. {
  587.     var T;
  588.     var yLoc;
  589.     var ease;
  590.     var time  = (new Date).getTime();
  591.     //var frame;
  592.         
  593.     // If isInfoItemDiv==true then we're showing or hiding one of the info items.
  594.     // Otherwise, we're showing or hiding the while info area.
  595.     var infoDivData = isMainInfoDiv ? resizeInfoDiv : resizeInfoItemDiv;
  596.     //var infoDivData = isInfoItemDiv ? resizeInfoItemDiv : resizeInfoDiv;
  597.     
  598.     T = limit_3(time-resizeAnimation.startTime, 0, resizeAnimation.duration);
  599.     ease = 0.5 - (0.5 * Math.cos(Math.PI * T / resizeAnimation.duration));
  600.  
  601.     
  602.     if (!isMainInfoDiv) //isInfoItemDiv
  603.         computeYAndResizeDiv(resizeInfoDiv, T, ease, false); //isInfoItemDiv
  604.     computeYAndResizeDiv(infoDivData, T, ease, true); //isInfoItemDiv
  605. }
  606.  
  607. function infoItemIsNotFullHeight()
  608. //function animHidingFinished()
  609. {
  610.     //alert("### infoItemIsNotFullHeight: info hidden");
  611.     
  612.     //hide clock
  613.     //var infoDivItem = infoDivs[timeDivIdx];        
  614.     //if (!infoDivItem.fullHeight)
  615.     //    document.getElementById('clockFace').setAttribute ("style", "display:none;");
  616.     
  617.     //decrease widget height after hiding(or decreasing height of) subInfo and info DIV
  618.     calcWidgetHeightAndResize();
  619. }
  620.  
  621.  
  622. function infoItemIsFullHeight()
  623. //function animShowingFinished()
  624. {
  625.     //alert("### infoItemIsFullHeight: info shown");
  626.     
  627.     //show clock
  628.     //var infoDivItem = infoDivs[timeDivIdx];        
  629.     //if (infoDivItem.fullHeight)
  630.     //    document.getElementById('clockFace').setAttribute ("style", "display:inline-block;");
  631. }
  632.  
  633. function infoItemContainerIsNowHidden()
  634. //function animHidingFinished()
  635. {
  636.     displayParent();
  637.     
  638.     //Don't show last divider bar
  639.     hideLastDividerBar();
  640.  
  641.     //decrease widget height after hiding(or decreasing height of) subInfo and info DIV
  642.     calcWidgetHeightAndResize();
  643. }
  644.  
  645.  
  646. function infoItemContainerIsNowShowing()
  647. //function animShowingFinished()
  648. {
  649.     displayParent();
  650.  
  651.     //Don't show last divider bar
  652.     //hideLastDividerBar();
  653. }
  654.  
  655. function animHidingFinished()
  656. {
  657.     //alert("### animHidingFinished: info hidden");
  658.     
  659.     //decrease widget height before hiding info DIV
  660.     calcWidgetHeightAndResize();
  661. }
  662.  
  663. function animShowingFinished()
  664. {
  665.     //alert("### animHidingFinished: info shown");
  666.     
  667.     //show the tabs
  668.     document.getElementById('divSunButton').setAttribute ("style", "display:inline-block;");
  669.     document.getElementById('divRiseSetButton').setAttribute ("style", "display:inline-block;");
  670.     document.getElementById('divTimeButton').setAttribute ("style", "display:inline-block;");
  671.     document.getElementById('divMoonButton').setAttribute ("style", "display:inline-block;");
  672. }
  673.  
  674. //---------
  675.  
  676. function enterflip(event)
  677. {
  678.     document.getElementById('fliprollie').style.display = 'block';
  679.     //document.getElementById('infoRollie').style.display = 'block';
  680. }
  681.  
  682. function exitflip(event)
  683. {
  684.     document.getElementById('fliprollie').style.display = 'none';
  685.     //document.getElementById('infoRollie').style.display = 'none';
  686. }
  687.  
  688. // variables
  689. var flipAnimation = {
  690.         duration:0, starttime:0, to:1.0, now:0.0, from:0.0,
  691.         element0:null, element1:null, element2:null, element3:null,
  692.         element4:null, //element5:null, element6:null, 
  693.         timer:null
  694.     };
  695. var flipShown = false;
  696.  
  697.  
  698. function flipAnimate()
  699. {
  700.     var T;
  701.     var ease;
  702.     var time = (new Date).getTime();
  703.         
  704.     
  705.     T = limit_3(time-flipAnimation.starttime, 0, flipAnimation.duration);
  706.     
  707.     if (T >= flipAnimation.duration)
  708.     {
  709.         clearInterval (flipAnimation.timer);
  710.         flipAnimation.timer = null;
  711.         flipAnimation.now = flipAnimation.to;
  712.     }
  713.     else
  714.     {
  715.         ease = 0.5 - (0.5 * Math.cos(Math.PI * T / flipAnimation.duration));
  716.         flipAnimation.now = computeNextFloat (flipAnimation.from, flipAnimation.to, ease);
  717.     }
  718.     
  719.     flipAnimation.element0.style.opacity = flipAnimation.now;
  720.     flipAnimation.element1.style.opacity = flipAnimation.now;
  721.     flipAnimation.element2.style.opacity = flipAnimation.now;
  722.     flipAnimation.element3.style.opacity = flipAnimation.now;
  723.     flipAnimation.element4.style.opacity = flipAnimation.now;
  724. }
  725.  
  726. function mousemove (event)
  727. {
  728.     if (!flipShown)
  729.     {
  730.         // fade in the flip widget
  731.         if (flipAnimation.timer != null)
  732.         {
  733.             clearInterval (flipAnimation.timer);
  734.             flipAnimation.timer  = null;
  735.         }
  736.         
  737.         var starttime = (new Date).getTime() - 13; // set it back one frame
  738.         
  739.         flipAnimation.duration = 500;
  740.         flipAnimation.starttime = starttime;
  741.         flipAnimation.element0 = document.getElementById ('flip');
  742.         flipAnimation.element1 = document.getElementById ('riseSetDivArrow');
  743.         flipAnimation.element2 = document.getElementById ('sunDivArrow');
  744.         flipAnimation.element3 = document.getElementById ('moonDivArrow');
  745.         flipAnimation.element4 = document.getElementById ('timeDivArrow');
  746.  
  747.         flipAnimation.timer = setInterval ("flipAnimate();", 13);
  748.         flipAnimation.from = flipAnimation.now;
  749.         flipAnimation.to = 1.0;
  750.         flipAnimate();
  751.         flipShown = true;
  752.     }
  753. }
  754.  
  755. function mouseexit (event)
  756. {
  757.     if (flipShown)
  758.     {
  759.         // fade in the flip widget
  760.         if (flipAnimation.timer != null)
  761.         {
  762.             clearInterval (flipAnimation.timer);
  763.             flipAnimation.timer  = null;
  764.         }
  765.         
  766.         var starttime = (new Date).getTime() - 13; // set it back one frame
  767.         
  768.         flipAnimation.duration = 500;
  769.         flipAnimation.starttime = starttime;
  770.         flipAnimation.element0 = document.getElementById ('flip');
  771.         flipAnimation.element1 = document.getElementById ('riseSetDivArrow');
  772.         flipAnimation.element2 = document.getElementById ('sunDivArrow');
  773.         flipAnimation.element3 = document.getElementById ('moonDivArrow');
  774.         flipAnimation.element4 = document.getElementById ('timeDivArrow');
  775.  
  776.         flipAnimation.timer = setInterval ("flipAnimate();", 13);
  777.         flipAnimation.from = flipAnimation.now;
  778.         flipAnimation.to = 0.0;
  779.         flipAnimate();
  780.         flipShown = false;
  781.     }
  782. }
  783.  
  784. var shiftWasDown = false;
  785. // For id='front' add:
  786. //    onmousedown='mousedown(event);'
  787. function mousedown (event)
  788. {
  789.     shiftWasDown = event.shiftKey;
  790.     /*
  791.     if (event.shiftKey)
  792.         alert("mousedown: event.shiftKey is TRUE");
  793.     else
  794.         alert("mousedown: event.shiftKey is false");
  795.     */
  796. }